<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>支付页面</title>
    <style>
        body { font: 12px/20px Arial, sans-serif; text-align:left; background:#f2f2f2; color:#333; font-family:"Microsoft YaHei"; }
        * { padding:0; margin:0; }
        input, label, select, option, textarea, button, fieldset, legend { font-family:Tahoma, sans-serif; }
        img, a img { border:0; }
        h1, h2, h3, h4, h5, h6 { font-size:12px; }
        ul, ol, li { list-style:none; }
        ol li{ list-style:decimal;}
        a { color:#0083DE; text-decoration:none; }
        a:hover { color:#f60; text-decoration:none; }
        i, em, dfn { font-style: normal; }
        .clearfix:before, .clearfix:after { content: ""; display: table; }
        .clearfix:after { clear: both; }
        .clearfix { zoom: 1; }
        .f-left, .f_right { display:inline; }
        .f-left { float:left; }
        .f-right { float:right;}
        .wrapper{ width:960px; margin:0 auto; background:#FFF; border:1px solid #ddd;}

        /*************** 圆角 ****************/
        .radius{ position:relative;}
        .radius i{ width:7px; height:7px; overflow:hidden; position:absolute; background:url(../images/borderradius.jpg) no-repeat;}
        .radius i.lt{ left:-1px; top:-1px; background-position:0 0;}
        .radius i.rt{ right:-1px; top:-1px; background-position:-7px 0;}
        .radius i.lb{ left:-1px; bottom:-1px; _bottom:-2px; background-position:0 -7px;}
        .radius i.rb{ right:-1px; bottom:-1px; _bottom:-2px; background-position:-7px -7px;}
        /*************** header ***************/
        .topbox { width:960px; margin:0 auto; height:30px; line-height:30px; border-bottom:1px solid #eee; color:#666;}
        .header { width:100%; margin:0px auto; background:#FFF; border-bottom:3px solid #0083DE;}
        .header .headbox { width:960px; margin:0px auto; }
        .headbox .logo { float:left; width:382px; margin:5px 0; }
        .headbox .adbox{ float:right; margin-top:35px;}
        /*************** footer ***************/
        .footer{ background:#FFF; border-top:1px solid #ddd; padding:20px 0; margin-top:10px; text-align:center; color:#666; line-height:30px;}

        /***************倒计时区域*****************/
        .ordertime{ margin-top:5px; padding:40px 0;}
        .ordertime .yes{ float:left; width:140px; text-align:center; margin-top:10px;}
        .ordertime .contfonts{ float:left; width:600px; font-size:14px; line-height:36px;}
        .ordertime .contfonts h1{ font-size:20px; float:left;}
        .ordertime .contfonts b{ margin-left:20px;}
        .ordertime .contfonts em{ color:#f60;}
        .ordertime .contfonts p.time{ font-weight:700; font-size:16px;}
        .ordertime .weixin{ float:left; border:1px solid #ddd;}
        .ordertime .weixin p{ background:#84be27; color:#FFF; text-align:center; font-size:14px;}
        /*超时*/
        .ordertime .contfonts h2{ font-size:20px;}
        /****************银行卡*******************/
        .bankcard{ padding:20px 0 50px; margin-top:5px;}
        .bankcard .title{ width:94%; margin-left:3%; _margin-left:1%; float:left; height:38px; position:relative; z-index:2;}
        .bankcard .title ul{ position:absolute; z-index:2;}
        .bankcard .title li{ float:left; margin:0 40px; _margin:0 40px 0 20px; line-height:30px; height:42px; font-size:16px; cursor:pointer; position:relative;}
        .bankcard .title li.cur{ background:url(../images/hottriancur.jpg) no-repeat center bottom; font-weight:700;}
        .bankcard .title li img{ position:absolute; top:0; right:-24px;}
        .grey_line{ width:100%; height:1px; overflow:hidden; background:#ddd; position:absolute; bottom:0; z-index:1;}
        /************银行卡列表************/
        .bankcard .cardlist{ width:86%; margin-left:7%; _margin-left:3%; float:left;}
        .cardlist dt{ padding:30px 0 0px;}
        .cardlist dt b{ font-size:14px;}
        .cardlist dd{ float:left; width:170px; height:47px; margin-right:25px; margin-top:15px;}
        .cardlist dd a{ display:block; width:168px; height:43px; border:1px solid #CCC; margin:1px; background:#FFF url(../images/bank_new.gif) no-repeat; position:relative;}
        .cardlist dd a:hover{  border:2px solid #ff7f00; margin:0;}
        .cardlist dd a.ny{ background-position:0 0;}
        .cardlist dd a.zg{ background-position:0 -45px;}
        .cardlist dd a.js{ background-position:0 -90px;}
        .cardlist dd a.gd{ background-position:0 -135px;}
        .cardlist dd a.xy{ background-position:0 -180px;}
        .cardlist dd a.zx{ background-position:0 -225px;}
        .cardlist dd a.zs{ background-position:0 -270px;}
        .cardlist dd a.ms{ background-position:0 -315px;}
        .cardlist dd a.gs{ background-position:0 -360px;}
        .cardlist dd a.fz{ background-position:0 -405px;}
        .cardlist dd a.pa{ background-position:0 -450px;}
        .cardlist dd a.jt{ background-position:0 -495px;}
        .cardlist dd a.yz{ background-position:0 -540px;}
        .cardlist dd a.pf{ background-position:0 -585px;}
        .cardlist dd a.gf{ background-position:0 -630px;}
        .cardlist dd a.sh{ background-position:0 -675px;}
        .cardlist dd a.fd{ background-position:0 -720px;}
        .cardlist dd a.zfb{ background-position:0 -765px;}
        .cardlist dd a.tenpay{ background:#FFF url(../images/qq_logo.png) no-repeat; background-position:8px;}
        /**add by yzt for 增加没有的几个银行 2015-2-3 start**/
        .cardlist dd a.nb{ background-position:0 -810px;}
        .cardlist dd a.bjns{ background-position:0 -855px;}
        .cardlist dd a.hz{ background-position:0 -900px;}
        .cardlist dd a.bj{ background-position:0 -945px;}
        .cardlist dd a.shns{ background-position:0 -990px;}
        /**add by yzt for 增加没有的几个银行 2015-2-3 end**/
        .cardlist dd a.chinapay{ background-position:0 -1036px;}
        .cardlist dd a.weixin{ background-position:0 -1086px;}
        .cardlist dd a.zfb2wm{ background:#FFF url(../images/zfb2wm.png) no-repeat right;}
        .cardlist dd a span{ position:absolute; right:0; top:0; width:20px; line-height:14px; text-align:center; color:#ff7f00; border-left:1px dotted #ff7f00; background:#fff6e9; height:36px; padding-top:7px; font-family:SimSun;}
        /***************常见问题**************/
        .faq{ margin-top:5px; padding-bottom:40px;}
        .faq h3{ font-size:16px; line-height:30px; padding-left:60px; margin-top:15px;}
        .faq ol{ padding:0 80px; color:#565656;}
        .faq ol li{ margin-top:10px;}
        /**********微信页面**********/
        .weixinbox{ margin-top:5px;}
        .weixinbox h3{ padding-left:60px; font-size:16px; line-height:30px; margin-top:20px;}
        .weixinbox .weixinsaomiao{ width:100%; height:460px; background:url(../images/weixinpic.jpg) no-repeat center;}
        .weixinbox .weixinsaomiao .erweima{ float:left; width:250px; height:250px; margin-left:178px; _margin-left:89px; margin-top:63px;}
        /*****************支付成功*****************/
        /**********QQ钱包页面**********/
        .tenpaybox{ margin-top:5px;}
        .tenpaybox h3{ padding-left:60px; font-size:16px; line-height:30px; margin-top:20px;}
        .tenpaybox .tenpaysaomiao{ width:100%; height:460px; background:url(../images/tenpaypic.jpg) no-repeat center;}
        .tenpaybox .tenpaysaomiao .erweima{ float:left; width:250px; height:250px; margin-left:178px; _margin-left:89px; margin-top:63px;}
        /*****************支付成功*****************/
        .success{ padding:80px 0;}
        .success h3{ font-size:20px; color:#f60;}
        .success .contfonts{ font-size:12px;}
        .success .contfonts span{ margin-right:10px;}
        /*点击银行列表弹出支付确认框*/
        .backgroundDiv{width:100%;height:100%;display:none;z-index:10;background-color:#000;position:fixed;_position:absolute;top:0px;left:0px;cursor:pointer;}
        .order_dl{ width:300px; background:#FFF; border:3px solid #CCC;position:absolute;float:left;z-index:11;}
        .order_dl .title{ width:90%; padding:0 5%; background:#0083de; line-height:30px; font-size:14px; color:#FFF; font-weight:700;}
        .order_dl .title a{ float:right; background:url(../book/images/close_01.jpg) no-repeat; width:20px; height:20px; margin-top:5px;}
        .order_dl .title a:hover{ background:url(../book/images/close_02.jpg) no-repeat;}
        .order_dl .intro{ width:90%; padding:25px 5% 0; height:55px;}
        .order_dl .intro li{ width:100%; line-height:24px; padding:5px 0;}
        .order_dl .intro li em{ color:#F60; font-weight:700;}
        .order_dl .intro li a{ background:#0083de;color:#fff; display:inline-block; height:26px;padding:0 10px; line-height:26px; text-align:center; margin-bottom:10px; font-size:12px;border-radius:3px;}
        .order_dl .intro li a.dl{ width:66px; background:#f80; color:#FFF;}
        /*核对*/
        .order_hedui { width:550px; background:#FFF; border:6px solid #CCC; position:absolute; float:left; z-index:11; }
        .order_hedui .title { width:94%; padding:0 3%; background:#0083de; line-height:36px; font-size:14px; color:#FFF; font-weight:700; }
        .order_hedui .title a { float:right; background:url(http://huochepiao.114piaowu.com/yuding/book/images/close_01.jpg) no-repeat; width:20px; height:20px; margin-top:8px; }
        .order_hedui .title a:hover { background:url(http://huochepiao.114piaowu.com/yuding/book/images/close_02.jpg) no-repeat; }
        .order_hedui .intro { width:92%; padding:0 4%; }
        .order_hedui .intro li { width:100%; line-height:24px; }
        .order_hedui .intro li.hr { border-bottom:1px solid #eee; margin-bottom:10px; }
        .order_hedui .intro li span { margin-left:20px; font-size:12px; }
        .order_hedui .intro li em { color:#F60; font-weight:700; }
        .order_hedui .intro li em.f20 { font-size:20px; }
        .order_hedui .intro li input.tj { display:inline-block; width:150px; border:0; cursor:pointer; height:29px; line-height:29px; font-weight:700; text-align:center; background:#ffb200 url(../../images/hdtj.jpg) no-repeat; font-size:14px; color:#FFF; margin-top:20px; margin-left:170px; margin-bottom:20px; }
        .order_hedui .intro li input.tj:hover { background:#ff9c00 url(../../images/hdtj_on.jpg) no-repeat; }
        .order_hedui .intro .ts { background:#fffde5; border:1px solid #ffab0d; padding:5px 10px; color:#e08e00; margin:10px 0; line-height:24px; }
        /*核验*/
        .order_heyan { width:450px; }
        /* 赠保信息 */
        .zbao_input_yes { margin:0px auto; text-align:center; }
        .zbao_input_yes input {
            background: #0080ff;
            font-size: 14px;
            color: #FFF;
            text-align: center;
            padding: 6px 20px;
            border: 0;
            border-radius: 3px;
            cursor: pointer;
            margin-top: 5px;
            width:100px;
        }
        .zbao_input input {
            background: #0080ff;
            font-size: 14px;
            color: #FFF;
            text-align: center;
            padding: 6px 20px;
            border: 0;
            border-radius: 3px;
            cursor: pointer;
            margin-top: 5px;
        }
        .zbao_img { position:relative; top:-15px; }

        .zbao_tbody { position:relative; left:100px; }
        .zbao_tbody td { line-height:28px; height:28px; }

    </style>
</head>
<body>
<div class="weixinbox wrapper radius clearfix" id="id_pay">
    <i class="lt"></i>
    <i class="rt"></i>
    <i class="lb"></i>
    <i class="rb"></i>
    <h3>微信支付</h3>
    <div class="weixinsaomiao">
        <div class="erweima"><img src="/front_system_war_exploded/payment/image" width="250" height="250" alt="微信二维码"></div>
        <div class="photo"><img src="img/payScan.png" width="430" height="400" alt="扫码"></div>
    </div>
</div>
</body>
</html>